<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" name="viewport" />
  <meta content="yes" name="apple-mobile-web-app-capable" />
  <meta content="black" name="apple-mobile-web-app-status-bar-style" />
  <meta content="telephone=no" name="format-detection" />
  <title>Document</title>
  <link rel="stylesheet" href="./css/base.css">
  <link rel="stylesheet" href="./css/swiper.min.css">
  <link rel="stylesheet" href="./css/index.css">
  <link rel="stylesheet" href="./css/media.css">
</head>

<body>
  <!-- header -->
  @-@include('header.html')
  <!-- header-end -->
  <!-- banner -->
  <div class="in-banner" style="background-image: url(./images/about-banner.jpg);">
    <div class="in-con">
      <h2><img src="./images/title-img-about.png" /></h2>
      <article>权威专家  ● 国家标准 ●  专业服务</article>
    </div>
  </div>
  <!-- banner-end -->
  <!-- about -->
  <div class="about-tabs">
    <a href="./about.html">中心介绍</a>
    <a href="./advantage.html">资源优势</a>
    <a href="./about-unit.html">合作单位</a>
    <a href="./contactUS.html" class="active">联系我们</a>
  </div>
  <div class="contactUs wid">
    <div class="cont-item">
      <header class="cont-tit"><span>联系方式</span></header>
      <section class="cont-sec">
        <div class="cont-info">
          <dl>
            <dt>北京中科创势科技成果评价中心</dt>
            <dd>地址：北京市海淀区北四环西路66号B座12层</dd>
            <dd>电话：010-68945000/ 010-68943000</dd>
            <dd>传真：010-68944000</dd>
            <dd>邮箱：www.zhongkechuangshi.com</dd>
          </dl>
        </div>
        <div class="cont-wechat">
          <ul class="clearfix">
            <li>
              <img src="./images/c-wechart.jpg">
              <span>中科创势科技官方微信</span>
            </li>
          </ul>
        </div>
      </section>
    </div>
    <div class="cont-item">
      <header class="cont-tit"><span>MAP</span></header>
      <section class="map-sec wid">
        <div class="mapContainer">
          <div id="mapContainer"></div>
        </div>
      </section>
    </div>

  </div>


  <!-- about-end -->
  <!-- footer -->
  @-@include('footer.html')
  <!-- footer-end -->
  <script src="./js/jquery.min.js"></script>
  <script src="./js/swiper.min.js"></script>
  <script src="./js/index.js"></script>

  <script src="//webapi.amap.com/maps?v=1.3&key=f97efc35164149d0c0f299e7a8adb3d2"></script>
  <script>
    $(".header nav ul li").eq(4).addClass('active')
  </script>
  <script>

! function () {
      var infoWindow, map, level = 14,
        center = {
          lng: 116.311384,
          lat: 39.985762
        },
        features = [{
          type: "Marker",
          name: "北京中科创势科技成果评价中心",
          desc: "",
          color: "red",
          icon: "cir",
          offset: {
            x: -9,
            y: -31
          },
          lnglat: {
            lng: 116.311384,
            lat: 39.985762
          }
        }];

      function loadFeatures() {
        for (var feature, data, i = 0, len = features.length, j, jl, path; i < len; i++) {
          data = features[i];
          switch (data.type) {
            case "Marker":
              feature = new AMap.Marker({
                map: map,
                position: new AMap.LngLat(data.lnglat.lng, data.lnglat.lat),
                zIndex: 3,
                extData: data,
                offset: new AMap.Pixel(data.offset.x, data.offset.y),
                title: data.name,
                content: '<div class="icon icon-' + data.icon + ' icon-' + data.icon + '-' + data.color + '"></div>'
              });
              break;
            case "Polyline":
              for (j = 0, jl = data.lnglat.length, path = []; j < jl; j++) {
                path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[j].lat));
              }
              feature = new AMap.Polyline({
                map: map,
                path: path,
                extData: data,
                zIndex: 2,
                strokeWeight: data.strokeWeight,
                strokeColor: data.strokeColor,
                strokeOpacity: data.strokeOpacity
              });
              break;
            case "Polygon":
              for (j = 0, jl = data.lnglat.length, path = []; j < jl; j++) {
                path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[j].lat));
              }
              feature = new AMap.Polygon({
                map: map,
                path: path,
                extData: data,
                zIndex: 1,
                strokeWeight: data.strokeWeight,
                strokeColor: data.strokeColor,
                strokeOpacity: data.strokeOpacity,
                fillColor: data.fillColor,
                fillOpacity: data.fillOpacity
              });
              break;
            default:
              feature = null;
          }
          if (feature) {
            AMap.event.addListener(feature, "click", mapFeatureClick);
          }
        }
      }

      function mapFeatureClick(e) {
        if (!infoWindow) {
          infoWindow = new AMap.InfoWindow({
            autoMove: true
          });
        }
        var extData = e.target.getExtData();
        infoWindow.setContent("<h5>" + extData.name + "</h5><div>" + extData.desc + "</div>");
        infoWindow.open(map, e.lnglat);
      }

      map = new AMap.Map("mapContainer", {
        center: new AMap.LngLat(center.lng, center.lat),
        level: level,
        keyboardEnable: false,
        doubleClickZoom: false
      });

      loadFeatures();

      map.on('complete', function () {
        map.plugin(["AMap.ToolBar"], function () {
          map.addControl(new AMap.ToolBar);
        });
      })

    }();

  </script>
</body>

</html>